//
//
var API_AREAS        = "http://jws.jalan.net/APICommon/AreaSearch/V1/";       // エリア検索API
var API_HOTELS       = "http://jws.jalan.net/APIAdvance/HotelSearch/V1/";     // 宿表示API アドバンス
var API_HOTELS_LITE  = "http://jws.jalan.net/APILite/HotelSearch/V1/";        // 宿表示API ライト
var API_ONSEN        = "http://jws.jalan.net/APICommon/OnsenSearch/V1/";      // 温泉検索API
var API_STOCK        = "http://jws.jalan.net/APIAdvance/StockSearch/V1/";     // 空室検索API
var API_KAIGAI       = "http://jws.jalan.net/rs/rsp0100/Rst0151Action.do";    // 海外ホテル表示API
var API_KAIGAI_STOCK = "http://jws.jalan.net/rs/rsp0100/Rst0153Action.do";    // 海外ホテル 空室検索API

// Request URL
var API_REQUEST_URL  = API_HOTELS_LITE;


// Picture Size
//
//  1:pictS          width:80px  height:画像による
//  2:pict           width:100px height:画像による
//  3:pictM（初期値）width:135px height:画像による
//  4:pictL          width:210px height:画像による
//  5:pictLL         width:300px height:300px
//
//  sample:http://www.jalan.net/jalan/doc/jws/data/pictsample.html
//
var PICTURE_SIZE     = 3;



$(function(){
	// 各種条件(☑) Array
	var check_Array       = new Array(
		"o_pool",               // 屋外プール
		"parking",              // 駐車場無料
		"pub_bath",             // 内湯・大浴場
		"onsen",                // 温泉
		"prv_bath",             // 貸切風呂
		"v_bath",               // 展望風呂
		"sauna",                // サウナ
		"jacz",                 // ジャグジー
		"mssg",                 // マッサージ
		"r_ski",                // 貸しスキー
		"r_brd",                // 貸しボード
		"pet",                  // ペットOKの宿
		"esthe",                // エステ設備
		"p_pong",               // 卓球あり
		"limo",                 // 送迎あり
		"late_out");            // アウト11時以降

	var 
	// エリア
		selectReg         = $("select[name='reg']"),        // エリア
		selectPref        = $("select[name='pref']"),       // 都道府県
		selectLArea       = $("select[name='l_area']"),     // 大エリア
		selectSArea       = $("select[name='s_area']"),     // 小エリア
	// 宿
		selecth_type      = $("select[name='h_type']"),     // ホテルタイプ
	// 各種条件(select)
		select_order      = $("select[name='check_order']"),// 並び順(1:５０音順 0:宿コード順（初期値）)
		select_start      = $("select[name='start']"),      // 出力されるデータの何件目から表示(初期値:1)
		select_count      = $("select[name='count']"),      // 表示最大件数(1～100 初期値:10)

	// エリア アレイセット
		form = $("form#drilldown"),
		submitButton = $("input:submit"),
		apiKey = $("input[name='key']").val(),
		selects = [selectReg,selectPref,selectLArea,selectSArea],
		defaults;

	//
	function init() {
		defaults = [];
		var len = selects.length;
		$.each(selects,function(i){
			var _this = $(this);
			_this.attr("disabled","disabled");
			_this.bind("change",function(){
				var idx = this.selectedIndex-1;
				var list = _this.data("list");
				if(list&&list[idx]&&list[idx].children) {
					appendOptions(i+1,list[idx].children);
				}
			});
			defaults[i] = _this.html();
		});
		form.bind("submit",onFormSubmit);
		$.ajax({
			type:"xml",
			url:API_AREAS+"?key="+apiKey,
			policyFile:"http://jws.jalan.net/crossdomain.xml",
			success:function(d){
				onLoadRegions(getList($("Region",d)));
			}
		});
	}
	function getList(nodeList) {
		var rtn = [];
		nodeList.each(function(){
			rtn.push(getObject($(this)));
		});
		return rtn;
	}
	function getObject(node) {
		var nn = (node[0].nodeName||"").toLowerCase();
		var name = node.attr("name");
		var code = node.attr("cd");
		var childName;
		switch(nn) {
			case "region"    : childName = "Prefecture"; break;
			case "prefecture": childName = "LargeArea"; break;
			case "largearea" : childName = "SmallArea"; break;
			default          : childName = "SmallArea"; break;
		}
		var rtn = { "name":name, "code":code };
		if(childName) rtn.children = getList($(childName,node));
		return rtn;
	}
	function onLoadRegions(regions) {
		appendOptions(0,regions);
	}
	function appendOptions(position,nodeList) {
		var select = selects[position];
		var def = defaults[position];
		select.data("list",nodeList);
		if(!nodeList||!nodeList.length) {
			select.html(def);
			select.attr("disabled","disabled");
			return;
		}
		var ht = [def];
		$.each(nodeList,function(){
			var code = this.code, name = this.name;
			ht.push("<option value=\""+code+"\">"+name+"<\/option>");
		});
		select.html(ht.join(""));
		select.attr("disabled","");
		select.val("");
		for(var i=position+1;i<selects.length;i++) {
			appendOptions(i,null);
		}
		submitButton.attr("disabled",selects[0].val()?"":"disabled");
	}
	// 検索ボタンをクリックされた時の処理
	function onFormSubmit() {
	// Area Set(pref,l_area,s_area 指定されている最後のもののみをセット)
		var len = selects.length;
		for(var i=len-1;i>=0;--i) {
			var sel = selects[i];
			var val = sel.val();
			var key = sel.attr("name");
			if(val) break;
		}
	// その他の検索パラメータキー
		var else_key = "";
	//  h_type(宿タイプ) 宿泊施設のタイプで絞り込みを行うかどうかを指定します。
	//   0:指定なし（初期値）     1:旅館                   2:ペンション・民宿
	//   3:貸別荘・コンドミニアム 4:ホテル・ビジネスホテル 5:公共の宿
	//
		else_key     += "&"+selecth_type.attr("name");
		else_key     += "="+selecth_type.val();
	// 各種チェック項目
	for(i=0; i<check_Array.length;i++){
		var check_selector="input[name='"+check_Array[i]+"']";
		var ckeck_element=$(check_selector);
		if(ckeck_element.is(':checked')){else_key += "&"+check_Array[i]+"=1";}
	}
		else_key     += "&"+select_order.attr("name");// 並び順(1:５０音順 0:宿コード順（初期値）)
		else_key     += "="+select_order.val();
		else_key     += "&"+select_start.attr("name");// 出力されるデータの何件目から表示(初期値:1)
		else_key     += "="+select_start.val();
		else_key     += "&"+select_count.attr("name");// 表示最大件数(1～100 初期値:10)
		else_key     += "="+select_count.val();

	//
		getResults(key,val,else_key);
		return false;
	}
	function getResults(key,value,else_keys) {
		$.ajax({
			type:"xml",
			url:API_REQUEST_URL+"?pict_size="+PICTURE_SIZE+"&key="+apiKey+"&"+key+"="+value+else_keys,
			policyFile:"http://jws.jalan.net/crossdomain.xml",
			success:onLoadResults
		});
	}
	function onLoadResults(d) {
		var ht = ["<ol>"];
		$("Hotel",d).each(function(){
			ht.push(getCassette($(this)));
		});
		ht.push("<\/ol>");
		$("#results").html(ht.join(""));
	}
	// 結果を書き込む
	function getCassette(d) {
		var NumberOfResults   = $("NumberOfResults",d).text()||"";
		var DisplayPerPage    = $("DisplayPerPage",d).text()||"";
		var DisplayFrom       = $("DisplayFrom",d).text()||"";
		var APIVersion        = $("APIVersion",d).text()||"";
		var HotelID           = $("HotelID",d).text()||"";
		var name              = $("HotelName",d).text()||"";
		var PostCode          = $("PostCode",d).text()||"";
		var HotelAddress      = $("HotelAddress",d).text()||"";
		var Region            = $("Region",d).text()||"";
		var Prefecture        = $("Prefecture",d).text()||"";
		var LargeArea         = $("LargeArea",d).text()||"";
		var SmallArea         = $("SmallArea",d).text()||"";
		var HotelType         = $("HotelType",d).text()||"";
		var url               = $("HotelDetailURL",d).text()||"";
		var copy              = $("HotelCatchCopy",d).text()||"";
		var HotelCaption      = $("HotelCaption",d).text()||"";
		var pict              = $("PictureURL",d).text()||"";
		var PictureCaption    = $("PictureCaption",d).text()||"";
		var AccessInformation = $("AccessInformation ",d).text()||"";
		var CheckInTime       = $("CheckInTime",d).text()||"";
		var CheckOutTime      = $("CheckOutTime",d).text()||"";
		var basho_x           = $("x",d).text()||"";
		var basho_y           = $("y",d).text()||"";

		return [
			"<li>",
				'<span class="pict"><a href="',url,'" target="_blank"><img src="'+pict+'"></a></span>',
				'<span class="list_wrap1">',
					'<span class="HotelID">HotelID：',HotelID,'</span>',
					'<span class="HotelType">タイプ：',HotelType,'</span>',
					'<span class="PictureCaption">外観：',PictureCaption,'</span><br><br>',
					'<span class="PostCode">郵便番号：',PostCode,'</span><br>',
					'<span class="HotelAddress">',HotelAddress,'</span><br><br>',
					'<span class="name"><a href="',url,'">',name,'</a></span>',
				'</span>',
				'<span class="list_wrap2">',
					'<span class="copy">',copy,'</span>','<br><br>',
					'<span class="HotelCaption">',HotelCaption,'</span>','<br><br>',
					'<span class="AccessInformation">アクセス：',AccessInformation,'</span><br><br>',
					'<span class="CheckInTime">CheckInTime ',CheckInTime,'～</span>　','　　　　',
					'<span class="CheckOutTime">CheckOutTime ～',CheckOutTime,'</span>',
				'</span>',
			"</li>"
		].join("");
	}
	$(document).proxyReady(init);
});